export type DataMap = {
    [key: string]: DataArr
}

export type DataArr = {
    [key: string]: string | number
}[]

export type PositionMap = {
    [key: string]: {
        x: number,
        y: number
    }
}

export type Margin = {
    top: number;
    left: number;
    right: number;
    bottom: number;
}

export type SVGSetting = ChartSetting;

export interface SizeSettings {
    id: string,

    width: number, 
    height: number,

    margin: {
        top: number,
        left: number,
        right: number,
        bottom: number,
    }
}

export interface ChartSetting extends SizeSettings { 
    type: string,
    
    chartElements: ChartElement[],

    dataSourceConfig: DataSourceConfig;
}

export type DataSourceConfig = {
    type: { x: DataSourceType, y: DataSourceType };
    dataSources: DataSource[];
    xReverse?: boolean;
    yReverse?: boolean;
}

export type DataSource = {
    id: string;
    arr: string;
    xField: string;
    yField: string;
}

export type ChartElementParam = {
    el: any;
    position: { x: number, y: number };
    chartSetting: ChartSetting;
    svgSizer: Sizer;
    svgScaler: Scaler;
}

export type SVGType = 'chart';

export type ChartType = 'xAxis' | 'yAxis' | 'line';

export type DataSourceType = 'Date' | 'Liner';

export type Point = {
    x: number;
    y: number;
}

// export type ChartData = {
//     arr: {
//         x: any;
//         y: any;
//     }[];

//     x: any[];
//     y: any[];
// };

export type Scalers = {
    x: any;
    y: any;
}

export interface Sizer {
    getPosition(settingId: string): Point;
}


export type ChartElement = XAxis | YAxis | Line;

export type XAxis = {
    type: 'xAxis';
}

export type YAxis = {
    type: 'yAxis';
}

export type Line = {
    type: 'line';
    sourceId: string;
    color?: string;
}


// =================

export type ChartDataMap = { [key: string]: ChartData | ChartDataGroup }

export type ChartData = {
    data: { x: any, y: any }[];
    x: any[];
    y: any[];
} 

export type ChartDataGroup = {
    data: { x: any, y: any }[];
    x: any[];
    y: any[];

    childMap: { [key: string]: ChartData }
}

export type ChartScaleMap = { [key: string]: ChartScale | ChartScaleGroup }

export type ChartScale = {
    x: (range: [number, number]) => any;
    y: (range: [number, number]) => any;
}

export type ChartScaleGroup = {
    x: (range: [number, number]) => any;
    y: (range: [number, number]) => any;

    childMap: { [key: string]: ChartScale }
}

export interface Scaler {
    getScalers(scaleId: string): ChartScale | null;
    getData(dataId: string): ChartData | null;
}